<!DOCTYPE html>

<html lang="en" xmlns:th="https://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>登录</title>
    <!--     Fonts and icons     -->
    <link rel="stylesheet" type="text/css"
          href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700|Material+Icons"/>
    <link rel="stylesheet" th:href="@{/assets/css/font-awesome.min.css}">
    <script th:src="@{/assets/js/core/jquery.min.js}"></script>
    <script th:src="@{/assets/plugins/rsaJs/jsbn.js}"></script>
    <script th:src="@{/assets/plugins/rsaJs/jsbn2.js}"></script>
    <script th:src="@{/assets/plugins/rsaJs/prng4.js}"></script>
    <script th:src="@{/assets/plugins/rsaJs/rsa.js}"></script>
    <script th:src="@{/assets/plugins/rsaJs/rng.js}"></script>
    <script th:src="@{/assets/plugins/rsaJs/rsa2.js}"></script>
    <link th:href="@{/assets/css/sb-admin-2.min.css}" rel="stylesheet">

</head>

<body class="bg-gradient-primary" id="">
<div class="container">
    <!--报错弹出框-->
    <div id="whidden" style="height:50px; display: block" ></div>
    <div id="walert" class="alert alert-warning" style="margin:0 auto;width:500px;text-align:center;display:none;">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close" onclick="javascript:xTag(this)">
            <i class="material-icons">close</i>
        </button>
        <span id="errormessage" style='text-align:center'></span>
    </div>
    <!-- Outer Row -->
    <div class="row justify-content-center">

        <div class="col-xl-10 col-lg-12 col-md-9">
            <div class="card o-hidden border-0 shadow-lg my-5">
                <div class="card-body p-0">
                    <!-- Nested Row within Card Body -->
                    <div class="row">
                        <div class="col-lg-6 d-none d-lg-block bg-login-image"></div>
                        <div class="col-lg-6">
                            <div class="p-5">
                                <div class="text-center">
                                    <h1 id="welcome" class="h4 text-gray-900 mb-4"
                                        th:text="${message} == null?'欢迎回来!':${message}">欢迎回来!</h1>
                                </div>
                                <form class="user" id="login" th:action="@{/user/login}" method="post">
                                    <div class="form-group">
                                        <input type="text" class="form-control form-control-user" id="login_account"
                                               name="username" placeholder="请输入账号" autocomplete="off">
                                    </div>
                                    <div class="form-group">
                                        <input type="password" class="form-control form-control-user" id="login_pwd"
                                               name="password" placeholder="请输入密码">
                                    </div>
                                    <div class="form-group">
                                        <input type="hidden" class="form-control form-control-user" id="loginToken"
                                               name="loginToken" th:value="${loginToken}" placeholder="请输入密码">
                                    </div>
                                    <div class="form-group">
                                        <div class="custom-control custom-checkbox small">
                                            <input type="checkbox" class="custom-control-input" id="customCheck" name="rememberMe">
                                            <label class="custom-control-label" for="customCheck" th:text="#{rememberMe}">Remember Me</label>
                                        </div>
                                    </div>
                                    <font color="red"></font>
                                    <!--                     <input type="submit"  class="btn btn-primary btn-user btn-block" value="登录"/>-->
                                    <input type="button" class="btn btn-primary btn-user btn-block" id="loginBtn"
                                           onclick="javascript:userLogin()" value="登录"/>
                                    <hr>
                                </form>
                                <hr>
                                <div class="text-center">
                                    <a class="small" th:href="@{/register}">注册账号!</a></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script th:replace="systemCommon/HarinCommon :: commonJs"></script>
<script type="text/javascript" th:inline="javascript">
    // var uri = "http://"+ [[${#httpServletRequest.getServerName()}]];
    // var port = [[${#httpServletRequest.getServerPort()}]];
    // var serverUri = uri + (isEmpty(port) ? "" : ":"+port);
    //获取
    let jumpUrl = [[${jumpUrl}]];
    let RSADo = {
        "modulus":"",
        "publicExponent":""
    }
    $(function (){
        window.onload=kickout();
        init();
        //console.log("原token"+[[${token}]]);
        //console.log("redis的token"+[[${rToken}]]);
        //清除本地缓存
        localStorage.removeItem("token");

        $(document).bind('keyup', function(event) {
            if (event.keyCode == "13") {
                $('#loginBtn').click();
            }
        });

        $.ajax({
            type: "GET",
            url: "/system/get/PAGE_SETTING",
            success:function(data){
                if(data.code==200){
                    if(data.result!=null && !isEmpty(data.result.loginImgUri)) {
                        $(".bg-login-image").css("background", "url(" + data.result.loginImgUri + ")")
                    }else{
                        //$(".bg-login-image").css("background", "url(" + data.result.loginImgUri + ")")
                    }
                }
            }
        })


    });

    function xTag(t) {
        var parent = $(t).parent();
        parent.hide();
        $("div#whidden").show();
    }
    function userLogin() {
        //form表单所有属性转成数组
        var fields = $('#login').serializeArray();
        let rsaKey = localStorage.getItem("rsaKey");
        var obj = {};
        //将数组装成对象
        $.each(fields, function (index, field) {
            obj[field.name] = field.value;  //通过变量，将属性值，属性一起放到对象中
        });
        var rsa = new RSAKey();
        rsa.setPublic(RSADo.modulus, RSADo.publicExponent);
        if(!isEmpty(rsaKey)) {
            $.ajax({
                type: "post",
                url: "/user/login",
                async: true,
                //contentType: 'application/json',
                dataType: 'json',
                data: {"rsaKey":rsaKey, "userCip": rsa.encrypt(JSON.stringify(obj))},//将对象转为json字符串
                success: function (data) {
                    if (data.code == 200) {
                        localStorage.removeItem("token");
                        localStorage.setItem("token", data.result.token);
                        if(!isEmpty(jumpUrl)){
                            window.location.href = jumpUrl;
                        }else {
                            window.location.href = "/index";
                        }
                    } else {
                        $("span#errormessage").text("");
                        $("span#errormessage").append("<b> 错误提示 - </b> <strong style='color:#ff472c;' >" + data.message + "</strong>");
                        $("#login_pwd").val("");
                        $("#login_account").focus();
                        $("div#whidden").hide();
                        $("div#walert").show();
                        init();
                    }
                }
            });
        }
    }
    function init(){
        $.ajax({
            url: "/getMoudle",
            type:"get",
            dataType: 'json', //服务器返回json格式数据
            async: false,
            success: function (data) {
                let result = data.result;
                RSADo.modulus = result.MODULUS;
                RSADo.publicExponent = result.PUBLIC_EXPONENT;
                localStorage.removeItem("rsaKey");
                localStorage.setItem("rsaKey",result.key);
            },
            error: function (xhr, type, errorThrown) {
            }
        });
    }
    function kickout(){
        let href=location.href;
        let t_flag = [[${param.t}]];
        if(href.indexOf("kickout")>0){
            alert("您的账号在另一台设备上登录,如非本人操作，请立即修改密码！");
        }
        if(t_flag){
            alert("您的账号被踢下，请重新登录！");
        }
    }
</script>
</body>
</html>